<template>
  <el-dialog
    :append-to-body="true"
    :close-on-click-modal="false"
    :before-close="cancel"
    :visible.sync="dialog"
    title="输入消费码"
    width="750px"
  >
    <el-form
      ref="form"
      :model="form"
      :rules="rules"
      size="small"
      label-width="100px"
    >
      <el-form-item label="消费码">
        <el-input v-model="form.code" style="width: 370px">
          <el-button
            :loading="loading1"
            slot="append"
            @click="selectCode"
            icon="el-icon-search"
          ></el-button>
        </el-input>
      </el-form-item>
      <el-form-item label="用户信息">
        <el-table
          :data="people"
          size="small"
          style="width: 100%; margin-top: 20px"
        >
          <el-table-column label="序号" width="80" prop="uid" />
          <el-table-column label="手机号" width="150" prop="phone" />
          <el-table-column label="用户姓名" width="100" prop="realName" />
          <el-table-column label="用户头像" width="150" prop="realName">
            <template slot-scope="scope">
              <img :src="scope.row.avatar" style="height: 80px" />
            </template>
          </el-table-column>

          <el-table-column label="地址" width="100" prop="addres" />
        </el-table>
      </el-form-item>
    </el-form>
    <div slot="footer" class="dialog-footer">
      <el-button type="text" @click="cancel">取消</el-button>
      <el-button :loading="loading" type="primary" @click="doSubmit"
        >确认用户</el-button
      >
    </div>
  </el-dialog>
</template>

<script>
import { check } from "@/api/yxUser";
export default {
  props: {
    isAdd: {
      type: Boolean,
      required: true,
    },
  },
  data() {
    return {
      code: "",
      loading: false,
      loading1: false,
      dialog: false,
      form: {},
      people: [],
      rules: {
        unique: [{ required: true, message: "please enter", trigger: "blur" }],
      },
    };
  },
  methods: {
    selectCode() {
      var data = this.form;
      this.people = [];
      this.loading1 = true;
      check(data)
        .then((res) => {
          this.people.push(res.data);
          this.loading1 = false;
        })
        .catch((err) => {
          this.loading = false;
        });
    },
    cancel() {
      this.resetForm();
    },
    doSubmit() {
      let item=this.people[0]
      item.saleCode=this.form.code
      this.loading = true;
      this.$nextTick(() => {
        this.$emit("doSubmit",item);
        this.dialog = false;
        this.loading = false;
        this.resetForm();
      });
    },
    resetForm() {
      this.dialog = false;
      this.$refs["form"].resetFields();
      this.form = {};
      this.code = null;
      this.people = [];
      this.loading = false;
      this.loading1 = false;
    },
  },
};
</script>

<style scoped>
</style>
